import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';
import 'package:msh_checkbox/msh_checkbox.dart';
import 'package:smart_translator/app/utils/CommonUtil.dart';
import '../../../event/DataCallBack.dart';
import '../../../routes/app_pages.dart';
import '../../../style/app_colors.dart';
import '../../../style/widget_style.dart';
import '../../../widgets/CommonWidgets.dart';
import '../controllers/login_controller.dart';

class LoginView extends GetResponsiveView<LoginController> {
  LoginView({super.key});
  final GlobalKey _formKey = GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) {
    return SafeArea(child: Scaffold(
        body: SingleChildScrollView(
          controller: controller.scrollController.value,
          child: Stack(
            children: [
              Container(
                child: SvgPicture.asset(
                  "assets/images/header_part_bg.svg",
                  width: Get.width,
                ),
              ),
              Container(
                width: Get.width,
                margin: EdgeInsets.only(top: 95.h),
                child: Column(
                  children: [
                    Image.asset('assets/images/login_logo.png',fit: BoxFit.contain, width: 114.w, height: 118.h),
                    SizedBox(height: 15.h,),
                    InkWell(
                      onTap: () {
                        Get.toNamed(Routes.CHOOSE_DEVICE);
                      },
                      child: Text('Hi~ 欢迎来到智译', style: AppStyleThemeData.BIG_TITLE),
                    )
                    ,
                    SizedBox(height: 35.h,),
                    Obx(() => Container(
                      child: Form(
                        key: _formKey,
                        child:  Container(
                          padding: EdgeInsets.only(left: 20.w,right: 20.h),
                          child: Column(
                            children: <Widget>[
                              Container(
                                  child: TextFormField(
                                      focusNode: controller.accountFocusNode.value,
                                      decoration: InputDecoration(
                                          labelText: '请输入手机号/邮箱',
                                          labelStyle: AppStyleThemeData.LABEL_TEXT_STYLE,
                                          suffixIcon: controller.suffixIconsVisible.value ? Transform.scale(
                                            scale: 0.5, // 调整缩放比例
                                            child: InkWell(
                                              onTap: () {
                                                /*  phoneFocusNode.requestFocus();
                                      validateFocusNode.unfocus();*/
                                                controller.accountController.value.text = '';
                                                controller.setSuffixIconsVisible(false);
                                              },
                                              child: Image.asset('assets/images/ic_clear.webp'),
                                            ),
                                          ): SizedBox(),
                                          // 关键配置：自定义边框样式
                                          border: const UnderlineInputBorder(
                                            borderSide: BorderSide(color: AppColors.input_bottom_line_color), // 默认状态边框颜色
                                          ),
                                          enabledBorder: const UnderlineInputBorder(
                                            borderSide: BorderSide(color: AppColors.input_bottom_line_color), // 默认状态边框颜色
                                          ),
                                          focusedBorder: const UnderlineInputBorder(
                                            borderSide: BorderSide(color: Colors.blue), // 聚焦状态边框颜色
                                          ),
                                          errorBorder: const UnderlineInputBorder(
                                            borderSide: BorderSide(color: Colors.red), // 错误状态边框颜色
                                          ),
                                          focusedErrorBorder: const UnderlineInputBorder(
                                            borderSide: BorderSide(color: Colors.red), // 聚焦+错误状态边框颜色
                                          ),
                                          contentPadding: const EdgeInsets.fromLTRB(16, 20, 16, 14),
                                          // 可选：添加浮动标签动画间距调整
                                          floatingLabelAlignment: FloatingLabelAlignment.start

                                      ),
                                      controller: controller.accountController.value,
                                      cursorColor: AppColors.app_base_theme_color,
                                      onChanged: (v) {
                                        controller.onTextFieldChange(v,'name');
                                      },
                                      validator: (v) {
                                        if(!CommonUtil.isEmail(v!) &&  !CommonUtil.isChinaPhoneLegal(v!)) {
                                          return '请输入正确的手机号或邮箱';
                                        }
                                      }
                                  )
                              ),
                              SizedBox(height: 10.h),
                              Container(
                                  child: TextFormField(
                                    focusNode: controller.pwFocusNode.value,
                                    cursorColor: AppColors.app_base_theme_color,
                                    keyboardType: TextInputType.text,
                                    controller: controller.passwordCodeController.value,
                                    obscureText: !controller.pwVisible.value, //This will obscure text dynamically
                                    decoration: InputDecoration(
                                      //labelText: label,
                                        labelText: '请输入密码',
                                        labelStyle: AppStyleThemeData.LABEL_TEXT_STYLE,
                                        //下面是重点
                                        suffixIcon: IconButton(
                                            icon: Icon(
                                              //根据passwordVisible状态显示不同的图标
                                              controller.pwVisible.value ? Icons.visibility : Icons.visibility_off,color: AppColors.disable_btn_bg_color,),
                                            onPressed: () {
                                              //更新状态控制密码显示或隐藏
                                              controller.pwVisible.value = ! controller.pwVisible.value;
                                            }),
                                        // 关键配置：自定义边框样式
                                        border: const UnderlineInputBorder(
                                          borderSide: BorderSide(color: AppColors.input_bottom_line_color), // 默认状态边框颜色
                                        ),
                                        enabledBorder: const UnderlineInputBorder(
                                          borderSide: BorderSide(color: AppColors.input_bottom_line_color), // 默认状态边框颜色
                                        ),
                                        focusedBorder: const UnderlineInputBorder(
                                          borderSide: BorderSide(color: Colors.blue), // 聚焦状态边框颜色
                                        ),
                                        errorBorder: const UnderlineInputBorder(
                                          borderSide: BorderSide(color: Colors.red), // 错误状态边框颜色
                                        ),
                                        focusedErrorBorder: const UnderlineInputBorder(
                                          borderSide: BorderSide(color: Colors.red), // 聚焦+错误状态边框颜色
                                        ),
                                        contentPadding: const EdgeInsets.fromLTRB(16, 20, 16, 14),
                                        // 可选：添加浮动标签动画间距调整
                                        floatingLabelAlignment: FloatingLabelAlignment.start

                                    ),
                                    validator: (v) {
                                      return CommonUtil.validatePassword(v!);
                                    },
                                    onChanged: (v) {
                                      controller.onTextFieldChange(v,'pwd');
                                    },

                                  )
                              ),
                              //爱好
                              SizedBox(height: 17.h),
                              Row(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: [
                                  RichText(
                                    text: TextSpan(
                                        children: [
                                          TextSpan(text: '没有账号? ', style: AppStyleThemeData.normal),
                                          TextSpan(text: '立即注册',style: AppStyleThemeData.linkStyle,recognizer: TapGestureRecognizer()..onTap=controller.register),
                                        ]
                                    ),
                                  ),
                                  RichText(
                                    text: TextSpan(
                                        children: [
                                          TextSpan(text: '忘记密码?',style: AppStyleThemeData.linkStyle,recognizer: TapGestureRecognizer()..onTap=controller.forgetPasswd),
                                        ]
                                    ),
                                  )
                                ],
                              ),
                              Container(
                                margin:  EdgeInsets.only(top: 40.h),
                                width: 594.w,
                                child: ElevatedButton(
                                    onPressed: controller.isSubmitBtnEnable.value == false ? null: () {
                                      if ((_formKey.currentState as FormState).validate()) {
                                        if (!controller.checkBoxChecked.value) {
                                          CommonWidgets.showAgreementDialog(context, '用户协议及隐私保护', '为了更好得保护您的权益,请您阅读并同意以下协议《用户协议》和《隐私政策》',
                                              '同意', '不同意', DataCallBack(
                                                  confirmCallBack: (v) {
                                                    print('confirmCallBack dialog : ${v}');
                                                    controller.checkBoxChecked.value = true;
                                                    controller.login();

                                                  },
                                                  cancleCallBack: (v) {
                                                    print('cancleCallBack dialog : ${v}');
                                                    //do nothing.

                                                  }
                                              ));

                                          return;
                                        }

                                        controller.login();


                                      }
                                    },
                                    child: const Text("登录")
                                ),
                              ),
                              SizedBox(height: 16.h),
                              Column(
                                crossAxisAlignment: CrossAxisAlignment.center,
                                children: [
                                  Row(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    children: [
                                      Obx(()=> MSHCheckbox(
                                        size: 16.w,
                                        value: controller.checkBoxChecked.value,
                                        colorConfig: MSHColorConfig.fromCheckedUncheckedDisabled(
                                          checkedColor: AppColors.Page_Title_Color,
                                        ),
                                        style: MSHCheckboxStyle.stroke,
                                        onChanged: (selected) {
                                          controller.checkBoxChecked.value = selected;
                                          controller.onCheckBoxChange();
                                        },
                                      )),
                                      SizedBox(width: 8.w,),
                                      RichText(
                                        text: TextSpan(
                                            children: [
                                              TextSpan(text: '您已阅读并同意', style: AppStyleThemeData.normal),
                                              TextSpan(text: '《用户协议》',style: AppStyleThemeData.linkStyle,recognizer: TapGestureRecognizer()..onTap=controller.onTapUserAgreementTask),
                                              TextSpan(text: '和', style: AppStyleThemeData.normal),
                                              TextSpan(text: '《隐私政策》',style: AppStyleThemeData.linkStyle,recognizer: TapGestureRecognizer()..onTap=controller.onTapPrivacyPolicyTask)

                                            ]
                                        ),
                                      )
                                      // Text('我已经阅读并同意 用户协议 隐私政策'),
                                    ],
                                  )
                                ],
                              ),
                              SizedBox(height: 60.h),
                              Row(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  SizedBox(width: 29.w,height: 0.5.h, child: Container(child: Text(''),color: AppColors.input_bottom_line_color,),),
                                  SizedBox(width: 10.w,),
                                  Text('其他登录方式',style: AppStyleThemeData.LABEL_TEXT_STYLE_12),
                                  SizedBox(width: 10.w,),
                                  SizedBox(width: 29.w,height: 0.5.h, child: Container(child: Text(''),color: AppColors.input_bottom_line_color,),),
                                ],
                              ),
                              SizedBox(height: 11.h,),
                              InkWell(
                                  onTap: () {
                                    Get.toNamed(Routes.PHONE_LOGIN);
                                  },
                                  child: Image.asset('assets/images/other_login_method.png',width: 32.w,height: 32.h,)
                              )

                            ],
                          ),
                        ),
                      ),))
                  ],
                ),
              )
            ],
          ),
        )
    ),top: false);
  }
}
